<template>
  <view>
    <SearchList v-if="shopCarts.length"
                :goods_list="shopCarts"
                :isCart="true"
                @handleNumChange="handleNumChange()"
                @handleDel="handleDel()"></SearchList>
    <u-empty v-else
             mode="car"
             margin-top="50"></u-empty>
  </view>
</template>

<script>
import SearchList from '@/components/SearchList.vue'
export default {
  components: { SearchList },
  data() {
    return {
      shopCarts: uni.getStorageSync('carts') || [],
    }
  },
  watch: {
    shopCarts: {
      deep: true,
      handler(val) {
        uni.setStorageSync('carts', val)
      },
    },
  },
  methods: {
    handleNumChange({ value, index }) {
      if (value <= 0) return this.handleDel(index)
      this.$set(this.shopCarts, index, { ...this.shopCarts[index], num: value })
    },
    handleDel(index) {
      uni.showModal({
        title: '提示',
        content: '确认删除？',
        success: ({ confirm, cancel }) => {
          if (confirm) this.shopCarts.splice(index, 1)
          else if (cancel && this.shopCarts[index] <= 0)
            this.shopCarts[index].num = 1
        },
      })
    },
  },
}
</script>

<style lang="scss">
</style>
